<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
      xmlns:h="http://java.sun.com/jsf/html"
      xmlns:p="http://primefaces.org/ui"
      xmlns:f="http://java.sun.com/jsf/core"
      xmlns:ui="http://java.sun.com/jsf/facelets"
      xmlns:pe="http://primefaces.org/ui/extensions"
      xmlns:c="http://java.sun.com/jsp/jstl/core">
    <h:head>
        <title>Laporan Keuangn</title>
        <link href="./resources/css/default.css" rel="stylesheet" type="text/css" />
    </h:head>
    <h:body>
        <ui:composition>
            <h:form>
                <script type="text/javascript">  
                    function handleSaveFS(xhr, status, args) {  
                        if(args.validationFailed || !args.success) {  
                                jQuery('#dialog').effect("shake", { times:3 }, 100);  
                            
                        } else dlgStateSetup.hide();  
                    }
                </script>
                
                <pe:masterDetail id="fsMasterDetail" selectLevelListener="#{selectLevelListener.handleNavigation}" style="width: 600px;" 
                                 styleClass="mdFlat" showBreadcrumb="false">
                    <pe:masterDetailLevel level="1" levelLabel="Laporan Keuangn">
                        <p:toolbar>
                            <p:toolbarGroup align="left">
                                <p:commandButton value="#{bundle.btnNew}" icon="ui-icon-document" process="@this"
                                    action="#{fstmtBean.newData()}" oncomplete="dlgStateSetup.show();" 
                                    update=":#{utilityBean.findClientId('dispStateSetup')}">
                                    <f:setPropertyActionListener target="#{fstmtBean.showDlg}" value="#{true}" />
                                </p:commandButton>

                                <p:commandButton value="#{bundle.btnEdit}" icon="ui-icon-disk" process="@this"
                                        actionListener="#{fstmtBean.openData()}" oncomplete="dlgStateSetup.show();" 
                                        update=":#{utilityBean.findClientId('dispStateSetup')}">
                                    <f:setPropertyActionListener target="#{fstmtBean.showDlg}" value="#{true}" />
                                </p:commandButton>

                                <p:commandButton value="#{bundle.btnDelete}" icon="ui-icon-trash" 
                                                actionListener="#{fstmtBean.delete()}" update="dtFstmts" />

                                <p:commandButton value="Next" style="margin-top: 10px;" icon="ui-icon-arrowthick-1-e">  
                                    <pe:selectDetailLevel step="1" listener="#{fstmtBean.cekReport()}" contextValue="#{fstmtBean.selectedData}" />  
                                </p:commandButton>
                            </p:toolbarGroup>
                        </p:toolbar>
                        
                        <p:dataTable id="dtFstmts" value="#{fstmtBean.fstmts}" var="fs" selection="#{fstmtBean.selectedData}" rowKey="#{fs.fstmtId}" 
                                     selectionMode="single">
                            <p:ajax event="rowSelect" listener="#{fstmtBean.onStateSelect}" /> 
                            <p:column>
                                <f:facet name="header" >Laporan Keuangan</f:facet>
                                <h:outputText value="#{fs.fstmtName}" />
                            </p:column>
                        </p:dataTable>
                    </pe:masterDetailLevel>
                    
                    <pe:masterDetailLevel level="2" levelLabel="Laporan Keuangn" contextVar="lapor">
                        <p:toolbar>
                            <p:toolbarGroup align="left">
                                <p:commandButton value="Back" style="margin-top: 10px;" icon="ui-icon ui-icon-arrowthick-1-w">  
                                    <pe:selectDetailLevel step="-1"/>  
                                </p:commandButton>
                                <p:commandButton value="#{bundle.btnLoad}" icon="ui-icon-arrowrefresh-1-w" action="#{fstmtBean.loadReport()}"/>
                                                                
                                <p:commandButton type="push" action="#{rptFstmtBean.execute(fstmtBean.reports)}" value="#{bundle.btnPrint}"  
                                         ajax="false" image="ui-icon-print" >
                                    <f:setPropertyActionListener value="#{fstmtBean.fstmtId}" target="#{rptFstmtBean.fstmtId}" />
                                    <f:setPropertyActionListener value="#{fstmtBean.year}" target="#{rptFstmtBean.year}" />
                                    <f:setPropertyActionListener value="#{fstmtBean.month}" target="#{rptFstmtBean.month}" />
                                    <f:setPropertyActionListener value="#{fstmtBean.branchId}" target="#{rptFstmtBean.branchId}" />
                                </p:commandButton>
                                
                            </p:toolbarGroup>
                        </p:toolbar>
                        
                        <p:panel header="#{fstmtBean.selectedData.fstmtName}" >
                            <h:panelGrid columns="6">
                                <h:outputLabel value="Periode" /><h:outputLabel value=":" />
                                <pe:inputNumber value="#{fstmtBean.month}" maxValue="12" thousandSeparator="" decimalPlaces="0" style="width: 20px; text-align: right;"/>
                                <pe:inputNumber value="#{fstmtBean.year}"  thousandSeparator="" decimalPlaces="0" maxValue="3000" style="width: 40px; text-align: right;" />
                                <h:outputLabel value="#{bundle.branch}" />
                                <p:selectOneMenu value="#{fstmtBean.branchId}" >
                                    <f:selectItem itemLabel="Semua Cabang" itemValue="0" />
                                    <f:selectItems value="#{fstmtBean.avblBranch}" />
                                </p:selectOneMenu>
                            </h:panelGrid>
                        </p:panel>
                        
                        <p:outputPanel autoUpdate="true" >
                       
                        <p:dataTable id="dtReports" value="#{fstmtBean.reports}" var="rpt" rowStyleClass="#{fstmtBean.rowClass(rpt.lineType)}">
                            <p:column width="300">
                                <f:facet name="header" >Deskripsi</f:facet>
                                <p:spacer width="20" rendered="#{rpt.lineType == 'D' or rpt.lineType == 'L'}"/>
                                <p:spacer width="10" rendered="#{rpt.lineType == 'T'}"/>
                                <h:outputText value="#{rpt.lineDescription}" />
                            </p:column>
                            
                            <p:column width="100" >
                                <f:facet name="header">#{fstmtBean.value01Text}</f:facet>
                                <h:outputText value="#{rpt.value01}" styleClass="numPos">
                                    <f:convertNumber groupingUsed="true" />
                                </h:outputText>
                            </p:column>
                            
                            <p:column width="100" rendered="#{fstmtBean.value02Text}">
                                <f:facet name="header">#{fstmtBean.value02Text}</f:facet>
                                <h:outputText value="#{rpt.value02}" styleClass="numPos">
                                    <f:convertNumber groupingUsed="true" />
                                </h:outputText>
                            </p:column>
                            
                            <p:column width="100" rendered="#{fstmtBean.value03Text}">
                                <f:facet name="header">#{fstmtBean.value03Text}</f:facet>
                                <h:outputText value="#{rpt.value04}" styleClass="numPos" />
                            </p:column>
                        </p:dataTable>
                        </p:outputPanel>    
                    </pe:masterDetailLevel>
                </pe:masterDetail>
            </h:form>
            
            <p:dialog header="Setup Laporan Keuangan" widgetVar="dlgStateSetup" closable="true" dynamic="true" modal="true" appendToBody="true" >
                <p:ajax listener="#{fstmtBean.handleClose}" />
                <h:form>
                    <h:panelGrid id="dispStateSetup" rendered="#{fstmtBean.showDlg == true}">
                        <ui:include src="fstmtsetup.xhtml" />

                        <h:panelGrid cellpadding="0" styleClass="pComBtnSTDR" >
                            <f:facet name="footer">
                                <p:commandButton value="#{bundle.btnSave}" icon="ui-icon-disk" process="@this" 
                                                 oncomplete="handleSaveFS(xhr, status, args);" 
                                                 actionListener="#{fstmtBean.save()}"
                                                 update=":#{utilityBean.findClientId('dtFstmts')}" />
                                <p:commandButton value="#{bundle.btnClose}" oncomplete="dlgStateSetup.hide();" immediate="true" icon="ui-icon-document" 
                                                 update=":#{utilityBean.findClientId('dtFstmts')}" process="@this" />
                            </f:facet>
                        </h:panelGrid>
                    </h:panelGrid>
                </h:form>
            </p:dialog>
        </ui:composition>
    </h:body>
</html>

